<template>
  <div class="info-message">
      <Headline :headline1="$t('m.MessageApplication')+'  /  '" :headline2="$t('m.PushRecord')"/>
      <a-card style="width: 100%">
          <a-select
        default-value="全部"
        style="width: 120px;
        margin-right: 15px;"
        @change="handleChange"
      >
        <a-select-option value="-1"> 全部 </a-select-option>
        <a-select-option value="1"> 学生 </a-select-option>
        <a-select-option value="2"> 家长 </a-select-option>
        <a-select-option value="3"> 职工 </a-select-option>
      </a-select>
      <a-date-picker
                format="YYYY-MM-DD HH:mm:ss"
                v-model="forminitial.startDate"
                @change="dataStartChange"
                show-time
              />
              -
              <a-date-picker
                format="YYYY-MM-DD HH:mm:ss"
                v-model="forminitial.endDate"
                @change="dataEndChange"
                show-time
                style="margin-right: 15px"
              />
              <a-input-search
        style="width: 310px;margin-right:20px"
        :placeholder="$t('m.PleaseEnterYourSearchTerms')"
        :enter-button="$t('m.Inquire')"
        size="default"
        v-model="forminitial.key"
        @search="infoMessageSearch"
      />
      <a-table
        :rowKey="(record) => record.id"
        style="margin-top: 30px"
        :data-source="data"
        :columns="columns"
        :pagination="false"
        bordered
      >
      <div slot="index" slot-scope="text, tags, i">
            {{(i+1) +(forminitial.page-1)*forminitial.limit}}
        </div>
      <img
          style="width: 50px; heigth: 50px; border-radius: 50%"
          slot="pic"
          slot-scope="text, record"
          :src="record.headimgurl"
        />
      </a-table>
      <a-pagination
        style="margin-top: 15 px"
        show-size-changer
        :default-current="1"
        :total="total"
        @change="Pages"
        :pageSizeOptions="['5', '10', '30', '40']"
        @showSizeChange="onShowSizeChange"
        class="pages"
      />
      </a-card>
  </div>
</template>

<script>
import Headline from '@/components/Headline'
import {getMsgRecordList} from '@/api/information'
import {Setperms} from '@/assets/js/setperms'

export default {
 name:"InfoMessage",
 components: { Headline},
 data(){
   return {
     forminitial:{
       userType:-1,
     endDate:this.$moment().format("YYYY-MM-DD HH:mm:ss"),
     startDate:this.$moment().subtract(1, "months").format("YYYY-MM-DD HH:mm:ss"),
     key:'',
     start:0,
     limit:10,
     page:1
   },
   data:[],
   total:0,
   columns:[
     {
        title:this.$t('m.SerialNumber'),
        scopedSlots: { customRender: "index" }
        },
        {
          title: this.$t('m.WeChatAatar'),
          dataIndex: "headimgurl",
          scopedSlots: { customRender: "pic" },
        },
        { title: this.$t('m.WeChatNickname'), dataIndex: "nickname" },
        { title: this.$t('m.Name'), dataIndex: "stafforstuname" },
        { title: this.$t('m.jobnumber'), dataIndex: "stafforstucode" },
        { title: this.$t('m.MessageHeader'), dataIndex: "templatename" },
        { title: this.$t('m.UserType'), dataIndex: "usertype" },
        { title: this.$t('m.MessagePushTime'), dataIndex: "createdate" },
        { title: this.$t('m.MessageDetails'), dataIndex: "msgcontent" },
   ]
   }

 },
created(){
  this.getDataList()
  this.parms = Setperms(this.$route.fullPath,JSON.parse(sessionStorage.getItem('menu')))
    console.log(this.parms)

},
methods:{
  isTrue(str){
      return this.parms.indexOf(str) !== -1;
    },
  infoMessageSearch(){
    this.getDataList()
  },
  handleChange(value){
    console.log(value)
    this.forminitial.userType = value;
    this.getDataList()
  },
  onShowSizeChange(page, limit) {
      this.forminitial.page = page;
      this.forminitial.limit = limit;
      this.getDataList();
    },
    Pages(page, pageSize) {
      this.forminitial.limit = pageSize;
      this.forminitial.page = page;
      this.forminitial.start = (page - 1) * pageSize;
      this.getDataList();
    },
  dataStartChange(value,mode){
    console.log(mode)
  },
  dataEndChange(value,mode){
    console.log(mode)
  },
  getDataList(){
    getMsgRecordList({params:this.forminitial})
    .then(res=> {
      if(res.data.success == true) {
            this.$message.success('获取数据成功')
            this.data = res.data.data;
          this.data.forEach(item => {
              if(item.usertype == 1) {
                  item.usertype = '学生'
              }
              if(item.usertype == 2) {
                  item.usertype = '家长'
              }
              if(item.usertype == 3) {
                  item.usertype = '职工'
              }

          })
          this.total = res.data.total;
          }
          if(res.data.success == false) {
            this.$message.error(res.data.msg)
          }

      console.log(res)
    })
    .catch(err => {
      this.$message.error('获取数据失败')
    })
  }
  }
}
</script>

<style lang="scss" scoped>


</style>
